﻿<%@ Page Language="C#" validaterequest="false" AutoEventWireup="true" CodeBehind="SectionDetailList.aspx.cs"
    Inherits="ExaminationSys.View.Section.SectionDetailList" %>

<%@ Import Namespace="System.Linq" %>
<%@ Import Namespace="System.Xml.Linq" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
    <title>Grouping DataView - Ext.NET Examples</title>
    <link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        div.item-wrap
        {
            float: left;
            border: 1px solid transparent;
            margin: 5px 25px 5px 25px;
            width: 100px;
            cursor: pointer;
            height: 120px;
            text-align: center;
        }
        
        div.item-wrap img
        {
            margin: 5px 0px 0px 5px;
            width: 61px;
            height: 77px;
        }
        
        div.item-wrap h6
        {
            font-size: 14px;
            color: #3A4B5B;
            font-family: tahoma,arial,san-serif;
        }
        
        div.x-view-over
        {
            border: solid 1px silver;
        }
        
        #items-ct
        {
            padding: 0px 30px 24px 30px;
        }
        
        #items-ct h2
        {
            border-bottom: 2px solid #3A4B5B;
            cursor: pointer;
        }
        
        #items-ct h2 div
        {
            background: transparent url(resources/images/group-expand-sprite.gif) no-repeat 3px -47px;
            padding: 4px 4px 4px 17px;
            font-family: tahoma,arial,san-serif;
            font-size: 12px;
            color: #3A4B5B;
        }
        
        #items-ct .collapsed h2 div
        {
            background-position: 3px 3px;
        }
        #items-ct dl
        {
            margin-left: 2px;
        }
        #items-ct .collapsed dl
        {
            display: none;
        }
    </style>
    <script type="text/javascript">
        var itemClick = function (view, record, item, index, e) {
            var group = e.getTarget("h2", 3, true);


            if (group) {
                group.up("div").toggleCls("collapsed");
                return false;
            }


            //SectionTypeId 
            //学习栏目 = 1    子栏目管理", subTypeItem = 0 //动机测试", subTypeItem = 1,  //水平测试", subTypeItem = 2, 
            //外链接 = 2,     subTypeItem = 0 
            //下载板块 = 3,   subTypeItem = 0 
            //信息栏目 = 4    subTypeItem = 0 




            var item = e.getTarget(".item-wrap");
            if (item) {
                var sectionid = item.parentNode.parentNode.firstChild.id
                var SectionTypeId = item.firstChild.nextSibling.attributes["text"].nodeValue;
                var subitem = item.firstChild.attributes["text"].nodeValue;
                var pageurl = 'SectionInformationEdit.aspx?SectionID=' + sectionid + '&Subitem=' + subitem + '&time=' + new Date();

                switch (SectionTypeId) {
                    case "1":  //[学习栏目]
                        if (subitem == "0") { //子栏目管理
                            document.location.href = "SubSectionInfoList.aspx?SectionID=" + sectionid;
                            return false;
                        }
                        if (subitem == "1") { //动机测试
                            document.location.href = "SectionSelectPaper.aspx?EnumTestType=" + subitem + "&SectionID=" + sectionid;
                            return false;
                        }
                        if (subitem == "2") { //水平测试
                            document.location.href = "SectionSelectPaper.aspx?EnumTestType=" + subitem + "&SectionID=" + sectionid;
                            return false;
                        }
                        break;
                    case "2": //[外链接]
                        GetSectionlinkInfo(sectionid, subitem); //编辑连接
                        break;
                    case "3": //[下载管理]
                        document.location.href = "SectionDownloadList.aspx?EnumTestType=" + subitem + "&SectionID=" + sectionid;
                        return false;

                        break;
                    case "4": //[信息栏目]
                        setInfo(pageurl);
                        break;
                    default: break;
                }



            }
        };

        //设置外链接
        var win = null; //窗口句柄
        var GetSectionlinkInfo = function (sectionid, itemtype) {

            //根据sectionid 从 SectionLink 表中获取LinkUrl
            var ashUrl = 'ashx/Section.ashx?';
            Ext.Ajax.request({
                url: ashUrl,
                params: {
                    Action: "getSectionLink",
                    ID: '',   //参数
                    SectionID: sectionid,
                    Title: '',
                    OrderIndex: 0,
                    Content: ''
                },
                method: 'POST',
                success: function (response) {
                    if (response) {

                        var result = response.responseText.split('|');
                        var linkurl;
                        var id;
                        if (result[0] == "true" && result[1] != "") {
                            var command = " var sectionLink =" + result[1];
                            eval(command);
                            linkurl = sectionLink.LinkUrl;
                            id = sectionLink.ID;


                        }
                        else {
                            linkurl = "http://";
                            id = "";
                        }
                        //弹出窗体
                        setlink(sectionid, itemtype, linkurl, id);

                    }
                },
                failure: function () {
                    Ext.Msg.alert("提示", "方法调用失败");
                }
            });

        }

        //创建并弹出LinkUrl 编辑窗体
        function setlink(sectionid, itemtype,linkurl,id) {
            var ashUrl = 'ashx/Section.ashx?' + "SectionID=" + sectionid + "&ID=" + id;
            var LinkUrl = linkurl;
            var editwin = Ext.create("Ext.window.Window", {
                title: '修改数据',
                height: 150,
                width: 600,
                modal: true,
                enable: true,
                layout: 'fit',
                items: {
                    xtype: 'form',
                    border: false,
                    bodyPadding: 5,
                    padding: "0px 0px 0px 5px",
                    width: 600,
                    layout: 'anchor',
                    align: 'center',
                    defaultType: 'textfield',
                    items: [{
                        xtype: "textfield",
                        width: 500,
                        fieldLabel: '链接地址:',
                        name: 'LinkUrl',
                        value: linkurl,
                        listeners: {
                            'change': function () {
                                LinkUrl = this.value;
                            }
                        },
                        allowBlank: true,
                        align: 'center'
                    }, {
                        xtype: 'button',
                        text: '保存',
                        margin: "14px 0px 0px 144px",
                        icon: "BulletGo",
                        align: 'center',
                        handler: function () {
                            //var form = this.up('form').getForm()
                            // LinkUrl = form.Items[0].value; 这个只能取到初始化的值。所以要加"change"事件来设置  LinkUrl = this.value;
                             
                            //保存
                            Ext.Ajax.request({
                                url: ashUrl,
                                params: {
                                    Action: "addSectionLink",
                                    ID: id,   //参数
                                    SectionID: sectionid,
                                    LinkUrl: LinkUrl,
                                    OrderIndex: 0,
                                    Content: ''
                                },
                                method: 'POST',
                                success: function (response) {
                                    if (response) {
                                        if (response.responseText.indexOf("true") >= 0) {
                                            Ext.Msg.alert("提示", "保存成功！");
                                            setTimeout(editwin.hide(null), 2000);
                                        }
                                    }
                                },
                                failure: function () {
                                    Ext.Msg.alert("提示", "方法调用失败");
                                }
                            });

                        }
                    }, {
                        xtype: 'button',
                        text: '取消',
                        icon: "Cancel",
                        margin: "14px 0px 0px 20px",
                        align: 'center',
                        handler: function () {
                            this.up('form').getForm().reset();
                            editwin.hide(null);
                        }
                    }],

                    store: Ext.create('Ext.data.ArrayStore', {})
                }
            });
            //显示窗体
             editwin.show();
        }

           //编辑信息
           function setInfo(pageurl) {

           win = new Ext.Window({
                title: '栏目详细',
                // maximizable : true,
                // maximized : true,
                width: 780,
                height: 520,
                // autoScroll : true,
                // bodyBorder : true,
                // draggable : true,
                isTopContainer: true,
                loadMask: {
                    showMask: true,
                    msg: "正在加载，请稍后……"
                },
                modal: true,
                resizable: false,
                contentEl: Ext.DomHelper.append(document.body, {
                    tag: 'iframe',
                    style: "border 0px none;scrollbar:false",
                    src: pageurl,
                    height: "100%",
                    width: "100%"
                })
            })
            win.show();

        }
    </script>
</head>
<body>
    <form id="Form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <h1>
        栏目详细</h1>
    <ext:Panel ID="DashBoardPanel" runat="server" Cls="items-view" Layout="FitLayout"
        AutoHeight="true" Width="800" Border="false">
        <TopBar>
            <ext:Toolbar ID="Toolbar1" runat="server" Flat="true">
                <Items>
                    <ext:ToolbarFill />
                    <ext:Button ID="Button1" runat="server" Icon="BulletPlus" Text="全部展开">
                        <Listeners>
                            <Click Handler="#{Dashboard}.el.select('.group-header').removeCls('collapsed');" />
                        </Listeners>
                    </ext:Button>
                    <ext:Button ID="Button2" runat="server" Icon="BulletMinus" Text="全部折叠">
                        <Listeners>
                            <Click Handler="#{Dashboard}.el.select('.group-header').addCls('collapsed');" />
                        </Listeners>
                    </ext:Button>
                    <ext:ToolbarSpacer ID="ToolbarSpacer1" runat="server" Width="30" />
                </Items>
            </ext:Toolbar>
        </TopBar>
        <Items>
            <ext:DataView ID="Dashboard" runat="server" SingleSelect="true" ItemSelector="div.group-header"
                AutoHeight="true" EmptyText="No items to display">
                <Store>
                    <ext:Store ID="Store1" runat="server">
                        <Model>
                            <ext:Model ID="Model1" runat="server">
                                <Fields>
                                    <ext:ModelField Name="Title" />
                                    <ext:ModelField Name="SectionID" />
                                    <ext:ModelField Name="Icon" />
                                    <ext:ModelField Name="Items" IsComplex="true" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <Tpl ID="Tpl1" runat="server">
                    <Html>
                        <div id="items-ct">
								<tpl for=".">
									<div class="group-header">
										<h2 id="{SectionID}">{Title}</h2>
										<dl>
											<tpl for="Items">
												<div  class="item-wrap">
                                                    <input id="subTypeItem" type="hidden" text="{subTypeItem}" />
                                                    <input id="SectionTypeId" type="hidden" text="{SectionTypeId}" />
													<img src="{Icon}"/>
													<div>
                                                        
														<H6>{subTypeItemTitle}</H6>                                                    
													</div>
												</div>
											</tpl>
											<div style="clear:left"></div>
										 </dl>
									</div>
								</tpl>
							</div>
                    </Html>
                </Tpl>
                <Listeners>
                    <ItemClick Fn="itemClick" />
                    <Refresh Handler="this.el.select('.item-wrap').addClsOnOver('x-view-over');" Delay="100" />
                </Listeners>
            </ext:DataView>
        </Items>
    </ext:Panel>
    </form>
</body>
</html>
